<div ng-include="sys_html('common/_header')"></div>
<style>
.fui-header:after {
	border-bottom: 0 solid #D9D9D9;
}
.fui-searchbar {padding-top:0.3rem;padding-bottom:0.3rem;margin-top:-2rem;height:auto;border-top-right-radius:1rem;border-top-left-radius:1rem;}
.searchbar .search-input input {
    height: 1.6rem;
}
.search-input i {
    line-height: 1.7rem;
}
.jylabels {
    display: inline;
    padding: 0 0.5rem;
    margin: 0.2rem;
    font-size: 0.55rem;
    line-height: 1.1rem;
    text-align: center;
    border-radius: 0.6rem;
}
.yuyue-duan {background:#fff;border: 0 solid #fff;border-radius: 4px;padding:0.1rem;margin:0.25rem 0.1rem;height:auto;width:auto;font-size:0.6rem;text-align:center}
.fui-header a.back:before {
	border-color: #fff
}
.fui-header a.back2:before {
	content: " ";
	display: inline-block;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	height: 0.5rem;
	width: 0.5rem;
	border-width: 0 0 2px 2px;
	border-color: #666;
	border-style: solid;
	position: relative;
	top:0;
}
.cartmode{
	bottom: 2.5rem
}
.cartmode-backpage{
	bottom: 4.3rem
}
.fui-number .minus:before, .fui-number .plus:before {
	border-left: 0 solid #d9d9d9;
}
.fui-number .minus:after, .fui-number .plus:after {
	border-right: 0 solid #d9d9d9;
}
.fui-number:before {
	border-top: 0 solid #d9d9d9;
}
.fui-number:after {border-top: 0 solid #d9d9d9;}
.fui-number .num {
	color:#666;
}
.fui-number .num {
	color:#666;
}
.fui-number.small {
	height: 1.2rem;
	width: auto;
	line-height: 1.2rem;
}
.fui-number .minus, .fui-number .plus {
	z-index:0;
}
.fui-number.small .minus{
	color: {{main.syscolor || '#63BE72'}};
	padding-top:1px;
	border: 1px solid {{main.syscolor || '#63BE72'}};
	border-radius:50%;
}
 .fui-number.small .plus {
	color: #fff;
	padding-top:1px;
	background: {{main.syscolor || '#63BE72'}};
	border: 1px solid {{main.syscolor || '#63BE72'}};
	border-radius:50%;
}
.fui-footer.quick {
    background: {{main.syscolor||'#db232b'}};
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    z-index: 30;
}
.fui-footer.quick .quick-cart {
    width: 3.6rem;
    position: relative;
}
.fui-footer.quick .quick-cart.an {
    animation: cartan 0.5s;
}
@keyframes cartan {
    0% {
        transform: scale(0.8);
        -ms-transform: scale(0.8);
        -webkit-transform:scale(0.8);
        -o-transform: scale(0.8);
        -moz-transform: scale(0.8);
    }
    25% {
        transform:scale(1.1);
        -ms-transform: scale(1.1);
        -webkit-transform:scale(1.1);
        -o-transform: scale(1.1);
        -moz-transform: scale(1.1);
    }
    50% {
        transform:scale(0.9);
        -ms-transform: scale(0.9);
        -webkit-transform:scale(0.9);
        -o-transform: scale(0.9);
        -moz-transform: scale(0.9);
    }
    100% {
        transform:scale(1);
        -ms-transform: scale(1);
        -webkit-transform:scale(1);
        -o-transform: scale(1);
        -moz-transform: scale(1);
    }
}
.fui-footer.quick .quick-cart .dot {
    background: #f60;
    border-radius: 0.5rem;
    color: #fff;
    font-size: 0.6rem;
    height: 0.8rem;
    line-height: 0.8rem;
    margin-left: 0.1rem;
    min-width: 0.8rem;
    padding: 0 0.2rem;
    position: absolute;
    top: 0.2rem;
    right: 0;
    vertical-align: top;
    text-align: center;
    z-index: 11;
    display: none;
}
.fui-footer.quick .quick-cart .inner {
    height: 3rem;
    width: 3rem;
    border-radius: 3rem;
    background: {{main.syscolor||'#db232b'}};
    border: 0.25rem solid #4d4d4d;
    color: #fff;
    text-align: center;
    line-height: 2.6rem;
    position: absolute;
    right: 0;
    bottom: 0.26rem;
    z-index: 10;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 0 4px rgba(0,0,0,0.3);
}
.fui-footer.quick .quick-cart .inner .icon {
    font-size: 1.4rem;
}
.fui-footer.quick .quick-cart.empty .inner {
    background: #404040;
    color: #67676b;
}
.fui-footer.quick .quick-info {
    width: 100%;
    padding: 0.3rem 0.4rem;
    line-height: 2.5rem;
    font-size: 0.65rem;
    color: #fff;
	border-right:2px solid #fff;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.fui-footer.quick .quick-info .price {
    font-size: 1.3rem;
    line-height: 1.6rem;
}
.fui-footer.quick .quick-submit {
    height: 2.5rem;
    padding: 0 1.2rem;
    line-height: 2.5rem;
    color: #fff;
    display: inline-block;
}
.fui-footer.quick .quick-submit.disabled {
    background: #fff;
}
/* 数量选择器 */
.quick-num {
    height: 1.1rem;
    width: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.quick-num.open .minus {
    -moz-transition-duration: 300ms;
    -webkit-transition-duration: 300ms;
    transition-duration: 300ms;
    -webkit-transform: translate3d(0, 0, 0) rotate(0deg);
    transform: translate3d(0, 0, 0) rotate(0deg);
    opacity: 1;
}
.quick-num.open .num {
    -moz-transition-duration: 300ms;
    -webkit-transition-duration: 300ms;
    transition-duration: 300ms;
    opacity: 1;
}
.quick-num.close .minus {
    animation: closeminus 0.2s;
    animation-fill-mode : forwards;
}
.quick-num.close .num {
    -moz-transition-duration: 100ms;
    -webkit-transition-duration: 100ms;
    transition-duration: 100ms;
    opacity: 0;
}
@keyframes closeminus {
    20% {
        -webkit-transform: translate3d(50%, 0, 0) rotate(0deg);
        transform: translate3d(50%, 0, 0) rotate(0deg);
        opacity: 1;
    }
    50% {
        -webkit-transform: translate3d(100%, 0, 0) rotate(30deg);
        transform: translate3d(100%, 0, 0) rotate(30deg);
        opacity: 0.5;
    }
    70% {
        -webkit-transform: translate3d(150%, 0, 0) rotate(60deg);
        transform: translate3d(150%, 0, 0) rotate(60deg);
        opacity: 0.3;
    }
    80% {
        -webkit-transform: translate3d(200%, 0, 0) rotate(90deg);
        transform: translate3d(200%, 0, 0) rotate(90deg);
        opacity: 0.2;
    }
    100% {
        opacity: 0;
    }
}
.quick-num .minus,
.quick-num .plus {
    height: 1.2rem;
    width: 1.2rem;
    line-height: 1.2rem;
    font-size: 1.2rem;
    text-align: center;
    border-radius: 2rem;
}
.quick-num .minus {
    color: {{main.syscolor||'#db232b'}};
    border: 1px solid {{main.syscolor||'#db232b'}};
    -webkit-transform: translate3d(200%, 0, 0) rotate(90deg);
    transform: translate3d(200%, 0, 0) rotate(90deg);
    -webkit-transition-property: -webkit-transform;
    transition-property: transform;
    background: #fff;
    opacity: 0;
    position: relative;
    z-index: 8;
}
.quick-num .minus.disabled {
    color: #dadada;
    border-color: #dadada;
}
.quick-num .plus {
    background: {{main.syscolor||'#db232b'}};
    color: #fff;
    position: relative;
    z-index: 11;
}
.quick-num .plus.disabled {
    background: #dadada;
}
.quick-num .num {
    height: 1.2rem;
    line-height: 1.2rem;
    font-size: 0.85rem;
    min-width: 1.2rem;
    padding: 0 0.2rem;
    text-align: center;
    color: #fff;
    opacity: 0;
}
.fui-goods-item .image {
    height: 3rem;
    width: 3rem;
}
.fui-fullHigh-item.menu {width:4.5rem;background-color:#fff}
.btn {font-size:0.7rem;margin:0.2rem 0.4rem;line-height:2.2}
.btn.btn-primary {
	background: {{main.syscolor || '#7c1cc9'}};
	color: #fff;
	border: 1px solid {{main.syscolor || '#7c1cc9'}}
}
</style>
<div class="fui-page fui-page-current page-shop-goods_category" style="background-color:#fff">
		<div class="topbg" style="position: relative;text-align:center;width:100%;height:4.5rem;background: {{main.syscolor || '#7c1cc9'}};">
			<div class="fui-header" style="background:none">
				<div class="fui-header-left">
					<a class="back" style="color:#fff" href="javascript:" ng-click="goback()"></a>
				</div>
				<div class="title bold" style="font-size:1rem;color:#fff">服务项目</div>
				<div class="fui-header-right" style="padding-right:0.5rem;color:#fff">
					<i class="icon jinyunicon icon-fenxiang2" onclick="$('#showsharecover').modal();" style="font-size: 1rem;margin-right:10px"></i>
					<i class="icon jinyunicon icon-liaotian" ng-click="access_json('jy_mfuwu/member.index/')" style="font-size: 1rem;"></i>
				</div>
			</div>
		</div>
		<div class="fui-searchbar bar" style="z-index: 0;background-color:#fff">
					<div ng-class="{'searchbar':1,'searchbar-active':pagedata.searchbar ==1}" style="background:none;padding-bottom:0.2rem">
							<div style="position: relative;left:0;top:0;">
								<div class="search-input">
									<i id="searchsub" class="icon icon-sousuo1" ng-click="access_json('/app.goods.index//keyword='+pagedata.params.keyword)"></i>
									<input type="search" placeholder="请输入服务名称" class="search" ng-model="pagedata.params.keyword" style="text-align: left; color: #999; background:#f2f2f2;border-radius: 1rem;" />
								</div>
							</div>
					</div>
					<div class="fui-tab-scroll" style="height:2rem">
						<div class="item" style="padding-left:0" ng-repeat="(k,v) in pagedata.searchkeyword">
							<div class="jylabels jylabel-f3f3f3" ng-click="pagedata.params.keyword=v;pagedata.getlist();">{{v}}</div>
						</div>
					</div>
		</div>
		<!-- 滚动后出现 -->
		<div ng-if="showtopheader" class="fui-header searchtop" style="height:2.6rem;background:#fff">
			<div class="fui-header-left" style="height: 2.5rem;">
				<a class="back2" href="javascript:" ng-click="goback()"></a>
			</div>
			<div class="fui-header-input" style="top:0.1rem;right:0.5rem">
				<div class="searchbar searchbar-active" style="margin-left:1.6rem">
						<div class="search-input" style="margin-right:1.5rem">
							<i id="searchsub" class="icon icon-sousuo1" ng-click="access_json('/app.goods.index//keyword='+pagedata.params.keyword)"></i>
							<input type="search" placeholder="请输入项目名称" class="search" ng-model="pagedata.params.keyword" style="text-align: left; color: #999; font-size:0.6rem;background:#f9f9f9;border-radius: 1rem;border: 0 solid #ddd;" />
						</div>
				</div>
			</div>
			<div class="fui-header-right" style="padding-right:0.5rem;">
					<i class="icon jinyunicon icon-fenxiang2" onclick="$('#showsharecover').modal();" style="font-size: 1rem;margin-right:10px"></i>
					<i class="icon jinyunicon icon-liaotian" ng-click="access_json('jy_mfuwu/app.member.index/')" style="font-size: 1rem;"></i>
			</div>
		</div>
	<div class="fui-content">
		<div ng-if="pagedata.shopset.open_tips==1" class="tips tips-yellow">
			<i class="fa fa-bullhorn"></i> [<red>温馨提示</red>]：{{pagedata.shopset.tips}}
		</div>
		<div class="fui-fullHigh-group" style="overflow-y:scroll;height:30rem">
			<div class="fui-fullHigh-item menu" id="tab">
				<div ng-repeat="(k,value) in pagedata.category" ng-click="pagedata.getgoods(k);" ng-class="{'btn':1,'btn-primary btn-banf':pagedata.params.pcate == value.id}" style="width:3.6rem">
				{{value.title}}
				</div>
				<div ng-if="pagedata.category.length<=0" class="btn btn-primary btn-banf" style="width:3.6rem">
				无分类
				</div>
			</div>
			<div class="fui-fullHigh-item container" style="position: relative;background-color:#f2f2f2;padding:0">
				<a id="advurl" class="swipe external" ng-show="pagedata.image" href="javascript:" ng-click="access_json(pagedata.advurl)" >
					<img id="advimg" ng-src="{{tomedia(pagedata.image) || '../core/resource/images/nopic.jpg'}}">
				</a>
				<div id="container">
				<div ng-if="pagedata.nowchilds.length>0" style="margin-top:0.2rem">
					<div style="overflow-x:scroll;white-space:nowrap;height:1.3rem">
						<span ng-repeat="c in pagedata.nowchilds" ng-class="{'jylabel jylabel-red-0':1,'active':pagedata.params.ccate == c.id}" ng-click="pagedata.getnowchilds($index);" style="margin-right:0.3rem;border-radius: 1rem;">{{c.title}}</span>
					</div>
				</div>				
				<div class="fui-goods-group block" style="margin-top:0.2rem">
						<div ng-repeat="g in pagedata.list" class="fui-goods-item">
							<div ng-click="access_json('jy_mfuwu/app.goods.detail//id='+g.id)" class="image" style="background-image: url({{tomedia(g.image)}})">
								<div ng-show="g.total<=0" class="salez" style="background-image: url({{tomedia(pagedata.setting.shop.saleout)}}); "></div>
							</div>
							<div ng-click="access_json('jy_mfuwu/app.goods.detail//id='+g.id)" class="detail" style="height:auto">
								<div class="name overflow-h2 bold">
										{{g.title}}
								</div>
								
								<div class="price" style="">
									<div class="text">￥{{g.active.price || g.price}} </div>
									<div ng-if="pagedata.shopset.noaddcart==1" class="subtitle" style="font-weight:400">已服务{{g.salenum || 0}}{{g.unit || '次'}}</div>
									<div ng-show="(!g.specs_list || g.specs_list.length < 1) && g.total==0" class="btn btn-sm btn-danger-o disabled" style="line-height:1rem;">已下架</div>
								</div>
							</div>
						</div>
				</div>
				<div class='content-empty' style="margin-top:0">
						<div ng-if="!pagedata.list || pagedata.list.length<1">
							<i class='icon icon-cry'></i><br/>该分类下,没有任何服务项目！
						</div>
				</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div ng-include="sys_html('goods/_modalpicker','','','jy_weishop')"></div>
<div ng-include="sys_html('app/common/_footer')"></div>
<div ng-include="sys_html('common/_gotop',true)"></div>
<div ng-include="sys_html('common/_share','','','jy_weishop')"></div>
<script>
scope.pagedata.nowckey = 0;  //状态标记
scope.pagedata.list=[];
scope.pagedata.getgoods=function(index){
	scope.pagedata.nowckey = index; 
	if(scope.pagedata.category[index]){
		scope.pagedata.nowchilds=scope.pagedata.category[index].childs;
		scope.pagedata.image=scope.pagedata.category[index].advimg;
		scope.pagedata.advurl=scope.pagedata.category[index].advurl;
		scope.pagedata.params.pcate=scope.pagedata.category[index].id
	}
	if(scope.pagedata.nowchilds.length>0){
		scope.pagedata.params.ccate=scope.pagedata.nowchilds[0].id
	}else{
		scope.pagedata.params.ccate=0;
	}
	scope.pagedata.list=[];
	scope.tool.get_list('jy_mfuwu/app.goods.index/getlist/is_specs=1',true);
}
if(scope.pagedata.params.pcate>0){
	scope.pagedata.getgoods(0);
}
if(scope.pagedata.list || scope.pagedata.list.length>1){
	scope.pagedata.scroll_bottom=function(){
			scope.tool.get_list('jy_mfuwu/app.goods.index/getlist/is_specs=1');
	}
}
scope.pagedata.getnowchilds=function(index){
	scope.pagedata.params.ccate=scope.pagedata.nowchilds[index].id
	scope.pagedata.list=[];
	scope.tool.get_list('jy_mfuwu/app.goods.index/getlist/is_specs=1',true);
}
//刷新总数和总价
scope.pagedata.refresh=function(){
	scope.pagedata.showprice=scope.price(scope.pagedata.totalprice);
	scope.$evalAsync();
}
//减少
scope.pagedata.minus=function(index){
	var g = scope.pagedata.list[index]
	if(g.carttotal<=0){
		return false;
	}
	scope.post_json('jy_weishop/member.cart/minus/',{'getlist':true,'id':g.cartid},function(res){
			g.carttotal--;
			scope.pagedata.list[index]=g
			scope.pagedata.refresh();
			
	});
}
//增加
scope.pagedata.plus=function(index){
	var g = scope.pagedata.list[index]
	g.optionid=0;
	if(g.carttotal>=g.total){
			scope.message('不能再添加了，已超过库存！','error');
			return false;
	}
	scope.post_json('jy_weishop/member.cart/addtocart/',{'getlist':true,'goodsid':g.id,'optionid':g.optionid},function(res){
			g.carttotal++;
			if(res!='success'){
				g.cartid=res.id;
				scope.pagedata.carts=res.list
			}
			scope.pagedata.list[index]=g
			scope.pagedata.refresh();
	});
}
//减少
scope.pagedata.sp_minus=function(){
	var g =scope.pagedata.g;
	if(g.carttotal<=0){
		return false;
	}
	scope.post_json('jy_weishop/member.cart/minus/',{'getlist':true,'id':g.cartid,'optionid':g.options.id},function(res){
			g.carttotal--;
			if(g.post[g.options.id].num<=0){
				return false;
			}
			scope.pagedata.carts=res.list
			g.post[g.options.id].num--;
			scope.pagedata.list[scope.pagedata.nowgkey]=g
			scope.pagedata.refresh();
			
	});
}
//增加
scope.pagedata.sp_plus=function(){
	var g =scope.pagedata.g;
	if(g.carttotal>=g.options.stock){
		scope.message('不能再添加了，已超过库存！','error');
		return false;
	}
	scope.post_json('jy_weishop/member.cart/addtocart/',{'getlist':true,'goodsid':g.id,'optionid':g.options.id},function(res){
			
			g.carttotal++;
			g.post[g.options.id].num++;
			if(res!='success'){
				g.cartid=res.id;
			}
			scope.pagedata.list[scope.pagedata.nowgkey]=g
			scope.pagedata.refresh();
	});
}
//选择
scope.pagedata.get_optionsid=function(){
	var specid = scope.pagedata.g.specid;
	specid = specid.join('_');
	scope.post_json('jy_mfuwu/app.goods.detail/get_optionsid/',{'goodsid':scope.pagedata.g.id,'specid':specid},function(res){
			var optionsid=res.options.id;
			scope.pagedata.g.options=res.options;
			scope.pagedata.g.selespename=res.selespename;
			if(!scope.pagedata.g.post[optionsid]){
				scope.pagedata.g.post[optionsid]={}
				scope.pagedata.g.post[optionsid]={
					'num':scope.pagedata.g.post[optionsid].num?scope.pagedata.g.post[optionsid].num:res.carttotal,
					'title':res.selespename,
				}
			}
			
			scope.$evalAsync();
	});
}
scope.pagedata.refresh();
</script>